$(function(){
    // banner部分

    // focus-nav部分：点击p标签后，自己获得active类，对应的大盒子淡入，另一个隐藏
    
    // focus-nav的点击事件
    $('.focus-nav p').click(function(){
        
        $(this).addClass('active').siblings().removeClass('active')
        // console.log($(this).index());
        $('.focus-info>div').eq($(this).index()).fadeIn().siblings().fadeOut(0)
    })
    const $focusInfo=$('.focus-map')

    // 改变需要移动盒子的宽度（增加一个图片的宽度），并在每个盒子里面的最后克隆第一个张图片添加上去
    $('.focus-info .bd').css('width',4452)
    $('#newBanner .bd').append($('#newBanner .bd p').first().clone(true))
    $('#oldBanner .bd').append($('#oldBanner .bd p').first().clone(true))

    // 先添加盒子在进行定义
    const $newBannerPs=$('#newBanner .bd p')
    const $oldBannerPs=$('#oldBanner .bd p')
    const $newBannerLis=$('#newBanner .hd li')
    const $oldBannerLis=$('#oldBanner .hd li')
    let newBannerIndex=0
    let oldBannerIndex=3
    // 十周年页面的点击事件
    $newBannerLis.click(function(){
        $(this).addClass('on').siblings().removeClass('on')
        newBannerIndex=$(this).index()
        $newBannerPs.parent().animate({left:-newBannerIndex*$newBannerPs.width()})
    })
    // 经典页面的点击事件
    $oldBannerLis.click(function(){
        $(this).addClass('on').siblings().removeClass('on')
        oldBannerIndex=$(this).index()
        $oldBannerPs.parent().animate({left:-oldBannerIndex*$oldBannerPs.width()})
    })
    
    // 十周年页面的自动轮播
    // $newBannerPs.parent().append($newBannerPs.first().clone())
    $('#newBanner').get(0).timeId=setInterval(function(){
        newBannerIndex++
        if(newBannerIndex>$newBannerPs.length-1){
            newBannerIndex=1
            $newBannerPs.parent().css('left',0)
        }
        $newBannerLis.eq(newBannerIndex==$newBannerPs.length-1?0:newBannerIndex).addClass('on').siblings().removeClass('on')
        $newBannerPs.parent().stop().animate({left:-newBannerIndex*$newBannerPs.width()})
    },3000)
    $focusInfo.mouseenter(function(){
        clearInterval($('#newBanner').get(0).timeId)
    })
    $focusInfo.mouseleave(function(){
        $('#newBanner').get(0).timeId=setInterval(function(){
            newBannerIndex++
            if(newBannerIndex>$newBannerPs.length-1){
                newBannerIndex=1
                $newBannerPs.parent().css('left',0)
            }
            $newBannerLis.eq(newBannerIndex==$newBannerPs.length-1?0:newBannerIndex).addClass('on').siblings().removeClass('on')
            $newBannerPs.parent().stop().animate({left:-newBannerIndex*$newBannerPs.width()})
        },3000)
    })

    // 经典页面的自动轮播
   $('#oldBanner').get(0).timeId=setInterval(function(){
    oldBannerIndex++
    // 索引的值根据图片对象的长度来判定
    if(oldBannerIndex>$oldBannerPs.length-1){
        oldBannerIndex=1
        $oldBannerPs.parent().css('left',0)
    }
    // 因索引最后一个值与$oldBannerLis对象的长度不一致，因此要对索引最后一个值判定后再赋值
    $oldBannerLis.eq(oldBannerIndex==$oldBannerPs.length-1?0:oldBannerIndex).addClass('on').siblings().removeClass('on')
    $oldBannerPs.parent().animate({left:-oldBannerIndex*$oldBannerPs.width()})
   },3000)
   $focusInfo.mouseenter(function(){
       clearInterval($('#oldBanner').get(0).timeId)
   })
   $focusInfo.mouseleave(function(){
    $('#oldBanner').get(0).timeId=setInterval(function(){
        oldBannerIndex++
        if(oldBannerIndex>$oldBannerPs.length-1){
            oldBannerIndex=1
            $oldBannerPs.parent().css('left',0)
        }
        $oldBannerLis.eq(oldBannerIndex==$oldBannerPs.length-1?0:oldBannerIndex).addClass('on').siblings().removeClass('on')
        $oldBannerPs.parent().animate({left:-oldBannerIndex*$oldBannerPs.width()})
       },3000)
   })
    
    // 游戏资讯
    $('.press-all .hd li').click(function(){
        $(this).addClass('on').siblings().removeClass('on')
        $('.press-all .bd div').eq($(this).index()).fadeIn(100).siblings().fadeOut(100)
    })

    // 游戏资讯右边
      $('.heros .hd li').mouseover(function(){
          $(this).addClass('on').siblings().removeClass('on')
          $('.heros .bd p').eq($(this).index()).fadeIn().siblings().fadeOut()
      })

    // 中间轮播图
    const $generalLis=$('.general .hd li')
    const $generalDivs=$('.general .bd>div')
    // console.log($generalLis,$generalDivs);
    let  genIndex=4

    // 点击事件
    $generalLis.click(function(){
        $(this).addClass('on').siblings().removeClass('on')
        $generalDivs.eq($(this).index()).fadeIn().siblings().fadeOut()
        genIndex=$(this).index()
    })
    // console.log($('.general .bd')[0]);
    $('.general')[0].timeId=setInterval(function(){
        // console.log(this);
        genIndex++;
        if(genIndex>$generalLis.length-1)genIndex=0
        $generalLis.eq(genIndex).addClass('on').siblings().removeClass('on')
        $generalDivs.eq(genIndex).fadeIn().siblings().fadeOut()
    },3000)
    $('.general').mouseenter(function(){
         clearInterval(this.timeId)
    })
    $('.general').mouseleave(function(){
        this.timeId=setInterval(function(){
            // console.log(this);
            genIndex++;
            if(genIndex>$generalLis.length-1)genIndex=0
            $generalLis.eq(genIndex).addClass('on').siblings().removeClass('on')
            $generalDivs.eq(genIndex).fadeIn().siblings().fadeOut()
        },3000)
    })


    // 同人专区
    $('.picture .photo-name>li').click(function(){
        $(this).addClass('on').siblings().removeClass('on')
          $('.photo-list').eq($(this).index()).fadeIn().siblings().fadeOut(0)
    })

    // 视频中心
    $('.video-name li').click(function(){
        $(this).addClass('on').siblings().removeClass('on')
          $('.video-tab>div').eq($(this).index()).fadeIn().siblings().fadeOut(0)
    })

    // 合作媒体部分
    let topicIndex=6
    const $picLis=$(' .picScroll-top li')
    console.log($(' .picScroll-top li'));
    $('.picScroll-top').get(0).timeId=setInterval(function(){
        topicIndex++
        if(topicIndex>($picLis.parent().height()-$picLis.parent().parent().height())/$picLis.height())
        topicIndex=0
        $picLis.parent().animate({top:-topicIndex*$picLis.height()})
    },1000)
    $('.picScroll-top').mouseenter(function(){
        clearInterval(this.timeId)
    })
    $('.picScroll-top').mouseleave(function(){
        this.timeId=setInterval(function(){
            topicIndex++
            if(topicIndex>($picLis.parent().height()-$picLis.parent().parent().height())/$picLis.height()){
                topicIndex=0
                $picLis.parent().css('top',0)
            }
            
            $picLis.parent().animate({top:-topicIndex*$picLis.height()})
        },3000)
    })

    //    下面的解说部分
    $('.indexTypes li .ratitle').click(function(){
        $(this).parent().addClass('current').animate({width:505}).siblings().removeClass('current').animate({width:143})
    })

})